<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>订货系统--顾客界面</title>
    <link rel="shortcut icon" type="favicon.ico" href="/static/img/img_icon_32.ico">
    <link rel="stylesheet" type="text/css" href="/static/css/customer.css">
    <script src="/static/js/jquery-1.11.1.min.js"></script>
    <script src="/static/js/jquery.cookie.js"></script>
    <script src="/static/js/customer.js"></script>
</head>
<body>
    <div class="bar">
        <div class="barElem" id="elem1">
            <img src="/static/img/img_icon.gif" class="img_com">
        </div>
        <div class="barElem" id="elem2">欢迎来到订货综合系统</div>
        <div class="barElem" id="elem3"><a href="/store/login">[ <span>退出</span> ]</a></div>
        <div class="barElem" id="elem4">
            <img src="/static/resources/users_photo/cus_photo/{{customerInfo['photo']}}" class="img_com">
        </div>
        <div class="barElem" id="elem5">
            欢迎顾客 <span id="account">{{customerInfo['account']}}</span>
        </div>
    </div>
    <div class="content">
        <div class="content_left">
            <div class="leftElem" id="cargo" onclick="showPanel(this)">货物信息面板</div>
            <div class="leftElem" id="orderForm" onclick="showPanel(this)">订货单面板</div>
            <div class="leftElem" id="personalCenter" onclick="showPanel(this)">个人中心面板</div>
        </div>
        <div class="content_right">
            <div id="cargoPanel">
                <div class="title">货 物 信 息 面 板</div>
                <div id="cargoInfo">
                    <div class="cargoElem">
                        <div class="cargoImg">
                            <img src="/static/resources/cargos_photo/{{ cargoInfo[0]['photo'] }}" height="100%">
                        </div>
                        <div class="cargoDesc">
                            <div class="desc">
                                <br/>
                                <span class="carg_no">{{cargoInfo[0]['no']}}</span>&nbsp&nbsp&nbsp<span class="carg_name">{{cargoInfo[0]['name']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_desc">{{cargoInfo[0]['desc']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_price">{{cargoInfo[0]['price']}}</span>元
                            </div>
                            <div class="cargoNum">
                                <div class="sub">
                                    <img src="/static/img/img_sub.png" height="100%">
                                </div>
                                <div class="num"> 0 </div>
                                <div class="plus">
                                    <img src="/static/img/img_plus.png" height="100%">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="cargoElem">
                        <div class="cargoImg">
                            <img src="/static/resources/cargos_photo/{{ cargoInfo[1]['photo'] }}" height="100%">
                        </div>
                        <div class="cargoDesc">
                            <div class="desc">
                                <br/>
                                <span class="carg_no">{{cargoInfo[1]['no']}}</span>&nbsp&nbsp&nbsp<span class="carg_name">{{cargoInfo[1]['name']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_desc">{{cargoInfo[1]['desc']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_price">{{cargoInfo[1]['price']}}</span>元
                            </div>
                            <div class="cargoNum">
                                <div class="sub">
                                    <img src="/static/img/img_sub.png" height="100%">
                                </div>
                                <div class="num"> 0 </div>
                                <div class="plus">
                                    <img src="/static/img/img_plus.png" height="100%">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="cargoElem">
                        <div class="cargoImg">
                            <img src="/static/resources/cargos_photo/{{ cargoInfo[2]['photo'] }}" height="100%">
                        </div>
                        <div class="cargoDesc">
                            <div class="desc">
                                <br/>
                                <span class="carg_no">{{cargoInfo[2]['no']}}</span>&nbsp&nbsp&nbsp<span class="carg_name">{{cargoInfo[2]['name']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_desc">{{cargoInfo[2]['desc']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_price">{{cargoInfo[2]['price']}}</span>元
                            </div>
                            <div class="cargoNum">
                                <div class="sub">
                                    <img src="/static/img/img_sub.png" height="100%">
                                </div>
                                <div class="num"> 0 </div>
                                <div class="plus">
                                    <img src="/static/img/img_plus.png" height="100%">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="cargoElem">
                        <div class="cargoImg">
                            <img src="/static/resources/cargos_photo/{{ cargoInfo[3]['photo'] }}" height="100%">
                        </div>
                        <div class="cargoDesc">
                            <div class="desc">
                                <br/>
                                <span class="carg_no">{{cargoInfo[3]['no']}}</span>&nbsp&nbsp&nbsp<span class="carg_name">{{cargoInfo[3]['name']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_desc">{{cargoInfo[3]['desc']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_price">{{cargoInfo[3]['price']}}</span>元
                            </div>
                            <div class="cargoNum">
                                <div class="sub">
                                    <img src="/static/img/img_sub.png" height="100%">
                                </div>
                                <div class="num"> 0 </div>
                                <div class="plus">
                                    <img src="/static/img/img_plus.png" height="100%">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="cargoElem">
                        <div class="cargoImg">
                            <img src="/static/resources/cargos_photo/{{ cargoInfo[4]['photo'] }}" height="100%">
                        </div>
                        <div class="cargoDesc">
                            <div class="desc">
                                <br/>
                                <span class="carg_no">{{cargoInfo[4]['no']}}</span>&nbsp&nbsp&nbsp<span class="carg_name">{{cargoInfo[4]['name']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_desc">{{cargoInfo[4]['desc']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_price">{{cargoInfo[4]['price']}}</span>元
                            </div>
                            <div class="cargoNum">
                                <div class="sub">
                                    <img src="/static/img/img_sub.png" height="100%">
                                </div>
                                <div class="num"> 0 </div>
                                <div class="plus">
                                    <img src="/static/img/img_plus.png" height="100%">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="cargoElem">
                        <div class="cargoImg">
                            <img src="/static/resources/cargos_photo/{{ cargoInfo[5]['photo'] }}" height="100%">
                        </div>
                        <div class="cargoDesc">
                            <div class="desc">
                                <br/>
                                <span class="carg_no">{{cargoInfo[5]['no']}}</span>&nbsp&nbsp&nbsp<span class="carg_name">{{cargoInfo[5]['name']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_desc">{{cargoInfo[5]['desc']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_price">{{cargoInfo[5]['price']}}</span>元
                            </div>
                            <div class="cargoNum">
                                <div class="sub">
                                    <img src="/static/img/img_sub.png" height="100%">
                                </div>
                                <div class="num"> 0 </div>
                                <div class="plus">
                                    <img src="/static/img/img_plus.png" height="100%">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="cargoElem">
                        <div class="cargoImg">
                            <img src="/static/resources/cargos_photo/{{ cargoInfo[6]['photo'] }}" height="100%">
                        </div>
                        <div class="cargoDesc">
                            <div class="desc">
                                <br/>
                                <span class="carg_no">{{cargoInfo[6]['no']}}</span>&nbsp&nbsp&nbsp<span class="carg_name">{{cargoInfo[6]['name']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_desc">{{cargoInfo[6]['desc']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_price">{{cargoInfo[6]['price']}}</span>元
                            </div>
                            <div class="cargoNum">
                                <div class="sub">
                                    <img src="/static/img/img_sub.png" height="100%">
                                </div>
                                <div class="num"> 0 </div>
                                <div class="plus">
                                    <img src="/static/img/img_plus.png" height="100%">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="cargoElem">
                        <div class="cargoImg">
                            <img src="/static/resources/cargos_photo/{{ cargoInfo[7]['photo'] }}" height="100%">
                        </div>
                        <div class="cargoDesc">
                            <div class="desc">
                                <br/>
                                <span class="carg_no">{{cargoInfo[7]['no']}}</span>&nbsp&nbsp&nbsp<span class="carg_name">{{cargoInfo[7]['name']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_desc">{{cargoInfo[7]['desc']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_price">{{cargoInfo[7]['price']}}</span>元
                            </div>
                            <div class="cargoNum">
                                <div class="sub">
                                    <img src="/static/img/img_sub.png" height="100%">
                                </div>
                                <div class="num"> 0 </div>
                                <div class="plus">
                                    <img src="/static/img/img_plus.png" height="100%">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="cargoElem">
                        <div class="cargoImg">
                            <img src="/static/resources/cargos_photo/{{ cargoInfo[8]['photo'] }}" height="100%">
                        </div>
                        <div class="cargoDesc">
                            <div class="desc">
                                <br/>
                                <span class="carg_no">{{cargoInfo[8]['no']}}</span>&nbsp&nbsp&nbsp<span class="carg_name">{{cargoInfo[8]['name']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_desc">{{cargoInfo[8]['desc']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_price">{{cargoInfo[8]['price']}}</span>元
                            </div>
                            <div class="cargoNum">
                                <div class="sub">
                                    <img src="/static/img/img_sub.png" height="100%">
                                </div>
                                <div class="num"> 0 </div>
                                <div class="plus">
                                    <img src="/static/img/img_plus.png" height="100%">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="cargoElem">
                        <div class="cargoImg">
                            <img src="/static/resources/cargos_photo/{{ cargoInfo[9]['photo'] }}" height="100%">
                        </div>
                        <div class="cargoDesc">
                            <div class="desc">
                                <br/>
                                <span class="carg_no">{{cargoInfo[9]['no']}}</span>&nbsp&nbsp&nbsp<span class="carg_name">{{cargoInfo[9]['name']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_desc">{{cargoInfo[9]['desc']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_price">{{cargoInfo[9]['price']}}</span>元
                            </div>
                            <div class="cargoNum">
                                <div class="sub">
                                    <img src="/static/img/img_sub.png" height="100%">
                                </div>
                                <div class="num"> 0 </div>
                                <div class="plus">
                                    <img src="/static/img/img_plus.png" height="100%">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="cargoElem">
                        <div class="cargoImg">
                            <img src="/static/resources/cargos_photo/{{ cargoInfo[10]['photo'] }}" height="100%">
                        </div>
                        <div class="cargoDesc">
                            <div class="desc">
                                <br/>
                                <span class="carg_no">{{cargoInfo[10]['no']}}</span>&nbsp&nbsp&nbsp<span class="carg_name">{{cargoInfo[10]['name']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_desc">{{cargoInfo[10]['desc']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_price">{{cargoInfo[10]['price']}}</span>元
                            </div>
                            <div class="cargoNum">
                                <div class="sub">
                                    <img src="/static/img/img_sub.png" height="100%">
                                </div>
                                <div class="num"> 0 </div>
                                <div class="plus">
                                    <img src="/static/img/img_plus.png" height="100%">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="cargoElem">
                        <div class="cargoImg">
                            <img src="/static/resources/cargos_photo/{{ cargoInfo[11]['photo'] }}" height="100%">
                        </div>
                        <div class="cargoDesc">
                            <div class="desc">
                                <br/>
                                <span class="carg_no">{{cargoInfo[11]['no']}}</span>&nbsp&nbsp&nbsp<span class="carg_name">{{cargoInfo[11]['name']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_desc">{{cargoInfo[11]['desc']}}</span>
                                <br/>
                                <br/>
                                <span class="carg_price">{{cargoInfo[11]['price']}}</span>元
                            </div>
                            <div class="cargoNum">
                                <div class="sub">
                                    <img src="/static/img/img_sub.png" height="100%">
                                </div>
                                <div class="num"> 0 </div>
                                <div class="plus">
                                    <img src="/static/img/img_plus.png" height="100%">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div id="page">
                    <div class="prevPage">&lt上一页</div>
                    <div class="pageElem currPage" id="firstElem">1</div>
                    <div class="lastPage">下一页&gt</div>
                </div>
                <div id="order">下订单（已选购<span id="cargo_sum_num">0</span>件商品，共计<span id="cargo_sum_money">0</span>元）<img src="/static/img/img_roundedRectangle.png" /></div>
            </div>
            <div id="orderFormPanel">
                <div class="title">订 货 单 面 板</div>
                <div class="radio">
                    <form>
                        <input type="radio" name="sel" id="notPayForm" value="notPay" checked="checked"/><label for="notPayForm">未结算订单</label>
                        <span class="blank"></span>
                        <input type="radio" name="sel" id="paidForm" value="paid"/><label for="paidForm">已结算订单</label>
                        <span class="blank"></span>
                        <input type="radio" name="sel" id="refundForm" value="finish"/><label for="refundForm">已完成订单</label>
                        <span class="blank"></span>
                        <input type="radio" name="sel" id="allForm" value="refund" /><label for="allForm">已退费订单</label>
                    </form>
                </div>
                <table class="showTable" id="table1">
                    <tr>
                        <th class="th1">序号</th>
                        <th class="th2">时间</th>
                        <th class="th3">账单描述</th>
                        <th class="th4">总金额</th>
                        <th class="th5">账单状态</th>
                    </tr>
                    {% for i in orderFormInfo %}
                        <tr>
                            <td class="td1">{{ orderFormInfo[i]['no'] }}</td>
                            <td class="td2">{{ orderFormInfo[i]['date'] }}</td>
                            <td class="td3">{{ orderFormInfo[i]['desc'] }}</td>
                            <td class="td4">{{ orderFormInfo[i]['total'] }}元</td>
                            <td class="td5">{{ orderFormInfo[i]['status'] }}</td>
                        </tr>
                    {% endfor %}
                </table>
            </div>
            <div id="personalPanel">
                <div class="title">个 人 中 心</div>
                <div style=" width:100%; text-align:center;">
                    <hr class="hrLine" />  基本信息 <hr class="hrLine" />
                    <div class="panel">
                        <img src="/static/resources/users_photo/cus_photo/{{customerInfo['photo']}}" width="130px" height="130px">
                        <div class="info" id="basicInfo">
                            <span>账户名</span><input name="account" class="basicInfo" type="text" disabled="disabled" value="{{ customerInfo['account'] }}"><br/><br/>
                            <span>地址</span><input name="address" class="basicInfo" type="text"disabled="disabled" value="{{ customerInfo['address'] }}">
                        </div><button id="modi" class="btn" style="float: right;" onclick="modiBasic()">修改</button>
                    </div>
                </div>
                <div style=" width:100%; text-align:center;">
                    <hr class="hrLine" />  &nbsp&nbsp&nbsp钱 包&nbsp&nbsp&nbsp  <hr class="hrLine" />
                    <div class="panel">
                        <div class="info">
                            <span>余额</span><input id="balance" type="text" disabled="disabled" value="{{ customerInfo['balance'] }}"><br/><br/>
                            <span>折扣</span><input type="text"disabled="disabled" value="{{ customerInfo['discount'] }}"><br/><br/>
                            <span>总花销</span><input type="text"disabled="disabled" value="{{ customerInfo['expend'] }}">
                        </div>
                        <button id="btn_rec" class="btn" style="position: absolute;top: 13px;right: 70px;" onclick="recharge()">充值</button>
                    </div>
                </div>
                <br/>
                <div style=" width:100%; text-align:center;">
                    <hr class="hrLine" />  修改密码 <hr class="hrLine" />
                    <div class="panel">
                        <div class="info" id="modiPwd">
                            <span>原密码</span><input type="password" name="originPwd" ><br/><br/>
                            <span>新密码</span><input type="password" name="newPwd" ><br/><br/>
                            <span>确认密码</span><input type="password" name="affirmPwd" ><br/>
                            <div class="error" id="error"></div>
                            <button class="btn" id="modiPwd_btn">确定修改</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>